{% extends 'base.html' %}
{% block content %}
<main class="page blog-post-list">
  <section class="clean-block clean-blog-list dark">
    <div class="container">
      <div class="block-heading">
        <h2 class="text-info">Blog Post List</h2>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc quam urna,
          dignissim
          nec
          auctor in,
          mattis vitae leo.</p>
      </div>
      <div style="text-align: center">
        <a href="{{ url_for('new')}}" span
           class="btn btn-primary btn-primary">添加文章</a>

        <a href="{{ url_for('logout')}}" span
           class="btn btn-primary btn-primary">退出登录</a>
      </div>
      <p></p>
      <div class="block-content" style="padding:0px 0px 10px">
        <div class="clean-blog-post">
          <div class="row">
            <div class="container">
              <div class="table table-bordered table-sm">
                <table>
                  <thead>
                  <tr>
                    <th class="text-center" style="align:center; ">序号</th>
                    <th class="text-center" style="vertical-align: middle;">标题</th>
                    <th class="text-center"
                        style="vertical-align: middle; align-content: center;">内容
                    </th>
                    <th class="text-center"
                        style="vertical-align: middle; align-content: center;"> 操作
                    </th>
                  </tr>
                  </thead>
                  <tbody>
                  {% for stus in stus %}
                  <tr>
                    <td class="text-center" style="vertical-align: middle"> {{
                      stus.id }}
                    </td>
                    <td style="vertical-align: middle">{{ stus.title }}
                    </td>
                    <td style="vertical-align: middle">{{ stus.content|safe }}
                    </td>
                    <td style="vertical-align: middle">
                      <a href="{{ url_for('edit', id=stus.id)}}" span
                         class="btn btn-primary btn-sm">编辑
                      </a>
                      <p></p>
                      <form action="{{ url_for('delete', id=stus.id)}}" method="POST">
                        <input type="submit" value="删除" class="btn btn-danger btn-sm"
                               onclick="return confirm('确定要删除吗?')">
                      </form>
                    </td>
                  </tr>
                  {% endfor %}
                  </tbody>
                </table>
              </div>
              <nav>
                <ul class="pagination justify-content-center">

                  {% if paginate.has_prev %}
                  <li class="page-link">
                    <a
                      href="{{url_for('admin')}}?page={{ paginate.prev_num }}">上一页</a>
                  </li>
                  {% endif %}

                  {% for num in range(1,2) %}
                  <li class="page-item">
                    <a class="page-link"
                       href="{{url_for('admin')}}?page={{num-1}}">{{paginate.page-1}}</a>
                  </li>

                  <li class="page-item">
                    <a class="page-link"
                       href="{{url_for('admin')}}?page={{num}}">{{paginate.page}}</a>
                  </li>

                  <li class="page-item">
                    <a class="page-link"
                       href="{{url_for('admin')}}?page={{num+1}}">{{paginate.page+1}}</a>
                  </li>
                  {% endfor %}

                  {% if paginate.has_next %}
                  <li class="page-link">
                    <a href="{{url_for('admin')}}?page={{ paginate.next_num }}"
                       aria-label="Next">下一页</a>
                  </li>
                  {% endif %}

                </ul>
              </nav>
            </div>
          </div>
        </div>
      </div>
    </div>
  </section>
</main>
<style>
    img {
        display: block;
        margin: 0 auto;
        width: auto;
        height: auto;
        max-height: 100%;
        max-width: 100%;
    }
</style>
{% endblock %}




